<template>
    <a-layout class="home">
        <a-layout-header><Header /></a-layout-header>
        <a-layout class="main">
            <a-layout-sider width="226px"> <Menu /></a-layout-sider>
            <a-layout-content> <RouterView /></a-layout-content>
        </a-layout>
    </a-layout>
</template>

<script setup lang="ts">
import Menu from "./components/Menu.vue";
import Header from "./components/Header.vue";
</script>

<style lang="less" scoped>
.home {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    display: flex;
}

.ant-layout-header {
    width: 100%;
    height: 60px;
    padding: 0 20px;
    background-color: #fff;
    box-shadow: #0000001a 0px 0px 8px 0px;
    z-index: 10;
}
.main {
    padding: 0;
    background: #f0f0f0;
    flex: 1;
    display: flex;
}
</style>
